<template>
  <div class="header">
      <van-nav-bar
      :title="title"
      :left-arrow="leftArrowShow"
      fixed
      @click-left="onClickLeft"
      />
  </div>
</template>

<script>
export default {
  name: 'IndexHeader',
  data(){
    return{
      leftArrowShow:this.$store.getters.parentRoute=='#'? false : true
    }
  },
  props: {
    title: String,
    routeName: String,
  },
  methods: {
    onClickLeft(){
      console.log(this.routeName);
      console.log(this.$store.getters.parentRoute);
      // this.$router.replace(this.routeName);
    }
  },
  watch: {  
    routeName(newVal, oldVal) {  
      if(newVal=='#'){
        console.log("为#不显示！");
        this.leftArrowShow=false
      }else{
        console.log(newVal);
        this.leftArrowShow=true
      }
    }  
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .header{
    height: 5vh;
  }
</style>
